<script>
import { defineAsyncComponent, h, provide, watchEffect, ref } from "vue";
export default {
  //   provide() {
  //     return {
  //       f: "this is father data",
  //     };
  //   },

  setup() {
    const son = defineAsyncComponent(() => import("../components/son.vue"));
    provide("f", "this is father data");
    provide("obj", {
      item1: "aaa",
      item2: "bbb",
      item3: "ccc",
    });
    const n = ref(0);
    watchEffect(() => {
      console.log(n);
    });

    setTimeout(() => {
      n.value++;
    }, 2000);

    return {
      son,
      n,
    };
  },
  render() {
    return (
      <>
        <div>this is father</div>
        <br />
        {h(this.son)}
      </>
    );
  },
};
</script>